<!-- <h3 class="text-black-50"> {{menuKey | uppercase}}</h3> -->
<style type="text/css">
.ng-star-inserted h4{
	text-align: center;
}
</style>
<div [ngSwitch]="menuKey" style="padding: 15px 5%;background: #fff;border-radius: 16px; box-shadow: 0px 2px 8px rgba(0,0,0,0.16); min-height:600px;">
  <div *ngSwitchCase="'user_guide'">
    <h4>{{'Latest Policy & Lending'|translate}}</h4>
    <div innerHTML="{{user_guide.content1}}"></div>
  </div>
  <div *ngSwitchCase="'training_module'">
      <h4>{{'Training Module'|translate}}</h4>
    <div innerHTML="{{training_module.content1}}"></div>

    <div *ngFor="let attachment of training_module.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB
    </div>
  </div>
  <div *ngSwitchCase="'user_agreement'">
      <h4>{{'Agreement and Commission'|translate}}</h4>
    <div innerHTML="{{user_agreement.content1}}"> </div>
    <div *ngFor="let attachment of user_agreement.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB
    </div>
  </div>
  <!-- agent resources -->
  <div *ngSwitchCase="'agent_resources_instructions'">
      <h4>{{'Instructions'|translate}}</h4>
    <div innerHTML="{{agent_resources_instructions.content1}}"></div>
    <div *ngFor="let attachment of agent_resources_instructions.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
    </div>
  </div>
  <div *ngSwitchCase="'deposit_form'">
    <h4>{{'Deposit Form'|translate}}</h4>
    <div innerHTML="{{agent_resources_deposit_form.content1}}"></div>
    <div *ngFor="let attachment of agent_resources_deposit_form.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
    </div>
  </div>
  <div *ngSwitchCase="'solicitor_contract'">
    <h4>{{'Solicitor Contact'|translate}}</h4>
    <div innerHTML="{{agent_resources_solicitor_contract.content1}}"></div>
    <div *ngFor="let attachment of agent_resources_solicitor_contract.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
    </div>
  </div>
  <div *ngSwitchCase="'management_agreement'">
    <h4>{{'Management Agreement'|translate}}</h4>
    <div innerHTML="{{agent_resources_management_agreement.content1}}"></div>
    <div *ngFor="let attachment of agent_resources_management_agreement.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
    </div>
  </div>
  <div *ngSwitchCase="'useful_documents'">
    <h4>{{'Useful Documents'|translate}}</h4>
    <div innerHTML="{{useful_documents.content1}}"></div>
    <div *ngFor="let attachment of useful_documents.content_attachments">
      <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
      {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
    </div>
  </div>
  <!-- FAQs -->
  <div *ngSwitchCase="'FQAs'">
    <h4>{{'Market Research Update'|translate}}</h4>
    <div innerHTML="{{FAQs.content1}}"></div>
    <div *ngFor="let attachment of FAQs.content_attachments">
        <a href="{{attachment.filePath}}" target="_blank">{{attachment.originalFilename}}</a>
        {{attachment.fileSize/1024 | number:'1.1-2'}} KB - {{attachment.createTime | date:'short'}}
      </div>
  </div>
</div>